<template>
  <div id="app" :class="className">
    <!-- 一级路由出口 -->
    <router-view />
  </div>
</template>

<script>
// 基于选择中三种颜色 切换app容器的类名 #409EFF one #1890FF two #304156 three
export default {
  name: 'App',
  data() {
    return {
      // className: 'two',
    }
  },
  computed: {
    className() {
      if (this.$store.state.settings.theme === '#409EFF') {
        return 'one'
      } else if (this.$store.state.settings.theme === '#1890FF') {
        return 'two'
      } else if (this.$store.state.settings.theme === '#304156') {
        return 'three'
      }
      return ''
    }
  }
}
</script>
